<template>
  <h4>鼠标移入看效果</h4>
  <div class="btn btn-hover btn-transition">demo-transition</div>
  <div class="btn btn-hover">demo</div>
</template>
<style lang="less" scoped>
.btn {
  padding: 6px 8px;
  border-radius: 6px;
  border: 1px solid #999;
  display: inline-block;
  font-size: 22px;
  line-height: 1.5;
  background: #fff;
}
.btn + .btn {
  margin-left: 5px;
}
.btn-transition {
  transition: background ease .6s;
}
.btn-hover:hover {
  background: #0099ff;
  color: #fff;
}

</style>
